<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
  <title>新增周边游</title>
  <link rel="stylesheet" href="../../css/bootstrap.font.min.css"/>
  <link rel="stylesheet" href="../../css/forms.min.css"/>
  <link rel="stylesheet" href="../../css/style.css"/>
</head>
<body ng-controller="productAdd">
<nav class="navbar navbar-inverse navbar-fixed-top to-nav">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span>
      </button>
      <a class="navbar-brand to-brand" href="#"><i class="fa fa-weixin fa-fw"></i>&nbsp;&nbsp;SZG 后台管理系统</a>
    </div>
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li class="dropdown">
          <a href="javascript:" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
            <i class="fa fa-gear"></i>&nbsp;Mr Toma&nbsp;<span class="caret"></span>
          </a>
          <ul class="dropdown-menu">
            <li><a href="#">个人信息</a></li>
            <li><a href="#">修改密码</a></li>
            <li role="separator" class="divider"></li>
            <li><a href="#">退出系统</a></li>
          </ul>
        </li>
      </ul>
    </div><!-- navbar-collapse -->
  </div>
</nav>
<!-- 菜单 start -->
<aside class="sidebar_left">
  <div class="sidebar_content">
    <ul class="nav">
      <li class="active">
        <a href="#" class="nav-link"><i class="fa fa-group"></i>产品管理</a>
        <ul class="link-lop">
          <li><a href="javascript:">周边游</a></li>
          <li><a href="javascript:">国内游</a></li>
          <li><a href="javascript:">出境游</a></li>
          <li><a href="javascript:">赴台游</a></li>
        </ul>
      </li>
      <li><a href="#" class="nav-link"><i class="fa fa-wrench"></i>网站设置</a></li>
    </ul>
  </div>
</aside>
<!-- 菜单 end -->
<section class="content">
  <div class="con-wap">
    <!-- view start -->

    <ol class="breadcrumb border">
      <li><a href="#">产品管理</a></li>
      <li><a href="#">周边游</a></li>
      <li class="active">新增周边游</li>
    </ol>

    <form action="#" class="" name="proForm" id="proForm">
    <article class="panel panel-default">
      <div class="panel-heading p20">
        <h3 class="no-m">基本信息</h3>
      </div>
      <div class="panel-body p20 admin-form app-form">
        <!-- 表单 start -->

          <div class="row">
            <div class="col-sm-3">
              <!--<a href class="app-product-imgup fa fa-image" data-toggle="modal" data-target="#imageUpModal"></a>-->
              <div class="app-product-imgup">
                <div class="swiper-container">
                  <div class="swiper-wrapper">
                  </div>
                  <div class="swiper-pagination"></div>
                </div>
                <a href class="btn btn-default imgup-btn" id="imageUpbtn">上传预览图</a>
                <input type="hidden" name="images" value="1231">
              </div>
            </div>
            <div class="col-sm-9">

              <div class="form-group displayt w100b">
                <label class="control-label cell w90 float-info"
                       data-toggle="popover"
                       data-html="true"
                       data-content="根据系统规则自动生成 <br> 旅游线路类产品名称生成规则：<br> 线路名称=<品牌名>+主标题+天夜数+线路形态+·副标题">
                  线路名称 <i class="fa fa-fw fa-exclamation-circle"></i>
                </label>
                <div class="cell app-product-title">
                  <span ng-show="brand" ng-bind="'【'+brand+'】'"></span>
                  <span ng-bind="contentTitle"></span>
                  <span ng-show="playDay" ng-bind="playDay+'日'"></span>
                  <span ng-show="playNight" ng-bind="playNight+'晚'"></span>
                  <span ng-bind="line"></span>
                  <span ng-show="subtitle" ng-bind="'('+subtitle+')'"></span>
                  <input type="hidden" value="【{{brand}}】{{contentTitle}} {{playDay}}日{{playNight}}晚{{line}}({{subtitle}})" name="proName">
                </div>
              </div>

              <div class="form-group displayt w100b">
                <label class="control-label cell w90">内部名称</label>
                <div class="cell">
                  <input type="text" class="gui-input" placeholder="用于平台内沟通使用" name="internalName">
                </div>
              </div>

              <div class="form-group displayt w100b">
                <label class="control-label cell w90">线路形态</label>
                <div class="cell lh20 option-group field">
                    <label class="option option-primary">
                      <input type="radio" name="line" value="跟团游" ng-model="line" required>
                      <span class="radio"></span>跟团游</label>
                    <label class="option option-primary">
                      <input type="radio" name="line" value="主题游" ng-model="line" required>
                      <span class="radio"></span>主题游</label>
                    <label class="option option-primary">
                      <input type="radio" name="line" value="半自助游" ng-model="line" required>
                      <span class="radio"></span>半自助游</label>
                    <label class="option option-primary">
                      <input type="radio" name="line" value="私家团" ng-model="line" required>
                      <span class="radio"></span>私家团</label>
                  <small class="ts" ng-if="proForm.line.$invalid"><i class="fa fa-exclamation-circle"></i> 必须选择一项</small>
                </div>
              </div>

              <div class="row">
                <div class="col-sm-4">
                  <div class="form-group displayt w100b">
                    <label class="control-label cell w90">品牌名</label>
                    <div class="cell">
                      <input type="text" class="gui-input"
                             placeholder="四个汉字"
                             maxlength="4"
                             ng-model="brand"
                             name="brand" ng-class="{err:proForm.brand.$invalid && proForm.brand.$touched}" required>
                      <small class="ts" ng-if="proForm.brand.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
                    </div>
                  </div>
                </div>
                <div class="col-sm-8">
                  <div class="form-group displayt w100b">
                    <label class="control-label cell w90">产品线</label>
                    <div class="cell">
                      <label class="select">
                        <select name="prolinOne" required ng-model="prolinOne">
                          <option value="">一级区域</option>
                          <option value="1">sdfsf</option>
                        </select>
                        <i class="arrow double"></i>
                      </label>
                      <small class="ts" ng-if="proForm.prolinOne.$invalid"><i class="fa fa-exclamation-circle"></i> 必须选择一项</small>
                    </div>
                    <div class="cell">
                      <label class="select">
                        <select name="prolinTwo" required ng-model="prolinTwo">
                          <option value="">二级区域</option>
                          <option value="1">sdfsf</option>
                        </select>
                        <i class="arrow double"></i>
                      </label>
                      <small class="ts" ng-if="proForm.prolinTwo.$invalid"><i class="fa fa-exclamation-circle"></i> 必须选择一项</small>
                    </div>
                  </div>
                </div>
              </div>

            </div>
          </div><!-- row -->

          <div class="mb15">
            <div class="form-group">
              <div class="displayt w100b">
                <label class="control-label cell w120 lh40 float-info"
                       data-toggle="popover"
                       data-html="true"
                       data-content="
                       1） 按照到达景区的先后顺序来选择国家/省/景区。<br>
                       2） 中转地并不住宿的，不得披露在主产品名称中。<br>
                       3） 国内产品（包括国内游代理产品和代理周边当地游），主名称中不能录“中国”。<br>
                       4） 境外产品（包括出境游代理产品和境外当地游），主名称请根据目的地城市知名度，自行选择是否录入国家名。<br>
                       5） 主名称中，若国家/省、景区、其它字段下，添加成功的任意字段值中出现相同的国家，或者相同的省份，则系统会只保留第一次出现的国家或者省份。例如，用户添加了湖北武汉+湖北宜昌，则系
                       ">
                  产品主标题 <i class="fa fa-fw fa-exclamation-circle"></i>
                </label>
                <div class="cell">
                  <input type="text" class="gui-input search-map"
                         placeholder="国家"
                         name="countries"
                         ng-model="countries"
                         ng-change="searchMap('countries',countries)">
                  <small class="ts" ng-if="proForm.contentTitle.$invalid"><i class="fa fa-exclamation-circle"></i> 至少添加一项</small>
                </div>
                <div class="cell">
                  <input type="text" class="gui-input search-map"
                         placeholder="省份"
                         name="provinces"
                         ng-model="provinces"
                         ng-change="searchMap('provinces',provinces)">
                </div>
                <div class="cell">
                  <input type="text" class="gui-input search-map"
                         placeholder="城市"
                         name="city"
                         ng-model="city"
                         ng-change="searchMap('city',city)">
                </div>
                <div class="cell">
                  <input type="text" class="gui-input search-map"
                         placeholder="景区"
                         name="scenic"
                         ng-model="scenic"
                         ng-change="searchMap('scenic',scenic)">
                </div>
                <div class="cell">
                  <input type="text" class="gui-input" placeholder="其他数据" name="other" ng-model="other">
                </div>
                <div class="cell inline w90">
                  <button type="button" class="button btn-warning btn-block" ng-click="addTitle()"><i class="fa fa-plus"></i> 添加</button>
                </div>
              </div>
              <div class="app-additem"><input type="hidden" name="contentTitle" ng-model="contentTitle" required>
                <span ng-repeat="title in contentTitleArr" ng-click="removeTitle(title.name)">{{title.name}} <i class="fa fa-close"></i></span>
              </div>
            </div>

            <div class="form-group displayt w100b">
              <label class="control-label cell w120 lh40">产品副标题</label>
              <div class="cell">
                <input type="text" class="gui-input"
                       placeholder="补充说明主标题，20个汉字以内，不允许输入联系方式，不允许出现特殊字符"
                       name="subtitle"
                       ng-model="subtitle"
                       ng-change="pattern.subtitle(subtitle)"
                       ng-class="{err:proForm.subtitle.$invalid && proForm.subtitle.$touched}"
                       required>
                <small class="ts" ng-if="proForm.subtitle.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
              </div>
            </div>

            <div class="row">
              <div class="col-sm-4">
                <div class="form-group displayt w100b lh40">
                  <label class="control-label cell w120 float-info"
                         data-toggle="popover"
                         data-html="true"
                         data-content="
                         1）天数为必填项，晚数选填。<br>
                         2）团队游产品行程天数 =回程抵达出发地日期-出发日期+1<br>
                         对于产品中既配置了正常时段航班，又有隔夜航班可选的，则统一按24点前起飞（抵达）的航班来计算天数。其他交通方式出行的产品也适用此规则。<br>
                         3）团队游产品行程晚数，区分国内、境外：国内：全部行程中除去在飞机、火车上过夜的，客人入住酒店（含帐篷、蒙古包等）、房车、邮轮（游轮）的晚数。<br>
                         境外：全部行程中除去在飞机上过夜的，客人入住酒店（含帐篷、蒙古包等）、火车、房车、邮轮（游轮）的晚数。
                         ">
                    天夜数 <i class="fa fa-fw fa-exclamation-circle"></i>
                  </label>
                  <div class="cell">
                    <input type="number" class="gui-input text-center"
                           placeholder="0"
                           ng-model="playDay"
                           name="playDay"
                           ng-change="pattern.day('playDay',playDay)"
                           required>
                    <small class="ts" ng-if="proForm.playDay.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
                  </div>
                  <div class="cell">天</div>
                  <div class="cell">
                    <input type="number" class="gui-input text-center"
                           placeholder="0"
                           ng-model="playNight"
                           name="playNight"
                           ng-change="pattern.day('playNight',playNight)"
                           required>
                    <small class="ts" ng-if="proForm.playNight.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
                  </div>
                  <div class="cell">夜</div>
                </div>
              </div>

              <div class="col-sm-4">
                <div class="form-group displayt w100b">
                  <label class="control-label cell w90">交通方式</label>
                  <div class="cell">
                    <label class="select">
                      <select name="letgo" ng-model="letgo" required>
                        <option value="">去程</option>
                        <option value="1">sdfsf</option>
                      </select>
                      <i class="arrow double"></i>
                    </label>
                    <small class="ts" ng-if="proForm.letgo.$invalid"><i class="fa fa-exclamation-circle"></i> 必须选择一项</small>
                  </div>
                  <div class="cell">
                    <label class="select">
                      <select name="letback" ng-model="letback" required>
                        <option value="">返程</option>
                        <option value="1">sdfsf</option>
                      </select>
                      <i class="arrow double"></i>
                    </label>
                    <small class="ts" ng-if="proForm.letback.$invalid"><i class="fa fa-exclamation-circle"></i> 必须选择一项</small>
                  </div>
                </div>
              </div>

              <div class="col-sm-4">
                <div class="form-group displayt w100b">
                  <div class="cell">
                    <input type="text" class="gui-input"
                           placeholder="出发地"
                           name="origin"
                           ng-model="origin"
                           ng-click="runMapli($event,'origin')"
                           id="origin"
                           readonly
                           required>
                    <small class="ts" ng-if="proForm.origin.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
                  </div>
                  <div class="cell">
                    <input type="text" class="gui-input"
                           placeholder="目的地"
                           name="destination"
                           ng-model="destination"
                           ng-click="runMapli($event,'destination')"
                           id="destination"
                           readonly
                           required>
                    <small class="ts" ng-if="proForm.destination.$invalid"><i class="fa fa-exclamation-circle"></i> 不能为空</small>
                  </div>
                </div>
              </div>
            </div>

            <div class="form-group displayt w100b">
              <label class="control-label cell w120">产品标签</label>
              <div class="cell lh20 option-group field">
                <label class="option option-primary">
                  <input type="checkbox" name="payment" checked>
                  <span class="checkbox"></span>预售</label>
                <label class="option option-primary">
                  <input type="checkbox" name="payment">
                  <span class="checkbox"></span>甩尾单</label>
                <label class="option option-primary">
                  <input type="checkbox" name="payment">
                  <span class="checkbox"></span>特价促销</label>
              </div>
            </div>

            <div class="form-group displayt">
              <label class="control-label cell w120 lh40">添加音频</label>
              <div class="cell">
                <label class="field prepend-icon append-button file">
                  <span class="button btn-primary">上传音频</span>
                  <input type="file" class="gui-file" name="file1" id="file1" onchange="document.getElementById('uploader1').value = this.value;">
                  <input type="text" class="gui-input" id="uploader1" placeholder="文件路径">
                  <label class="field-icon">
                    <i class="fa fa-upload"></i>
                  </label>
                </label>
              </div>
            </div>

            <div class="section">
              <label for="comment" class="field prepend-icon">
                <textarea class="gui-textarea" id="comment" name="comment" placeholder="推荐概述"></textarea>
                <label for="comment" class="field-icon">
                  <i class="fa fa-comments"></i>
                </label>
              </label>
            </div>

          </div><!-- pt20 -->

          <div class="mb15">
            <hr>
            <h3 class="mb20">预定控制</h3>
            <div class="row">
              <div class="col-sm-5">
                <div class="form-group displayt w100b lh40">
                  <label class="control-label cell w120">预定联系人</label>
                  <div class="cell">
                    <input type="text" class="gui-input" placeholder="预定联系人" name="contacter">
                  </div>
                </div>
              </div>
              <div class="col-sm-4">
                <div class="form-group displayt w100b lh40">
                  <label class="control-label cell w120">预定联系人手机</label>
                  <div class="cell">
                    <input type="text" class="gui-input" placeholder="预定联系人手机" name="contacterTel">
                  </div>
                </div>
              </div>
              <div class="col-sm-3">
                <div class="form-group displayt w100b">
                  <label class="control-label cell w120 inline">新订单短信提醒</label>
                  <div class="cell pt5">
                    <label class="switch switch-primary no-m">
                      <input type="checkbox" name="remember" id="SMS" name="SMS">
                      <label for="SMS" data-on="是" data-off="否"></label>
                    </label>
                  </div>
                </div>
              </div>
            </div>

            <div class="row">
              <div class="col-sm-5">
                <div class="form-group displayt w100b lh40">
                  <label class="control-label cell w120">提前预定时间</label>
                  <div class="cell">
                    <input type="text" class="gui-input" placeholder="0" name="scheduledStart">
                  </div>
                  <div class="cell">天</div>
                  <div class="cell">
                    <input type="text" class="gui-input" placeholder="0" name="scheduledEnd">
                  </div>
                  <div class="cell">时</div>
                </div>
              </div>
              <div class="col-sm-4">
                <div class="form-group displayt w100b">
                  <label class="control-label cell w120 lh40">确认方式</label>
                  <div class="cell">
                    <label class="select">
                      <select class="" name="" name="confirm">
                        <option value="0">自动确认</option>
                        <option value="1">人工确认</option>
                      </select>
                      <i class="arrow double"></i>
                    </label>
                  </div>
                </div>
              </div>
              <div class="col-sm-3">
                <div class="form-group displayt w100b">
                  <label class="control-label cell w120 inline">儿童是否可定</label>
                  <div class="cell pt5">
                    <label class="switch switch-primary no-m">
                      <input type="checkbox" name="children" id="children">
                      <label for="children" data-on="是" data-off="否"></label>
                    </label>
                  </div>
                </div>
              </div>
            </div>

            <div class="row">
              <div class="col-sm-5">
                <div class="form-group displayt w100b no-m">
                  <label class="control-label cell w120 lh40">发布渠道</label>
                  <div class="cell">
                    <label class="select">
                      <select name="channel">
                        <option value="0">所有</option>
                        <option value="1">人工确认</option>
                      </select>
                      <i class="arrow double"></i>
                    </label>
                  </div>
                </div>
              </div>
            </div>

          </div>
        <!-- 表单 end -->
      </div>
      <div class="panel-footer p20 text-right">
        <button type="button" class="btn btn-default w120 btn-lg">返回</button>
        <button type="submit" class="btn btn-warning w160 btn-lg" ng-disabled="proForm.$invalid">保存并下一步</button>
      </div>
    </article>
    </form>

    <div class="h360"></div>
    <!-- view end -->
  </div>
</section>

<!-- 查询框 -->
<div class="datalist">
  <ul><li ng-repeat="map in proMap" ng-click="touchMap($event)">{{map}}</li></ul>
</div>

<!-- 地点查询 -->
<div class="maplist">
  <ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">国内</a></li>
    <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">国外</a></li>
  </ul>
  <div class="tab-content border">
    <div role="tabpanel" class="tab-pane active" id="home">
      <nav class="ml-header border-b p10 clearfix">
        <a href ng-repeat="w in words" ng-click="wordsMap('g',w)">{{w}}</a>
      </nav>
      <article class="ml-body p10 clearfix">
        <a href ng-repeat="m in mapList" ng-click="mapAdd(m)">{{m}}</a>
      </article>
    </div>
    <div role="tabpanel" class="tab-pane" id="profile">
      <nav class="ml-header border-b p10 clearfix">
        <a href ng-repeat="w in words" ng-click="wordsMap('w',w)">{{w}}</a>
      </nav>
      <article class="ml-body p10 clearfix">
        <a href ng-repeat="m in mapList" ng-click="mapAdd(m)">{{m}}</a>
      </article>
    </div>
  </div>
</div>

<!-- 多图上传 -->
<div class="modal fade" role="dialog" aria-labelledby="gridSystemModalLabel" id="imageUpModal">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header text-center">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">上传预览图</h4>
      </div>
      <div class="modal-body">

        <form id="uploadForm" enctype="multipart/form-data">
          <div class="upload_box">
            <div class="upload_main">
              <label class="upload_choose">
                <input id="fileImage" type="file" size="30" name="fileselect[]" accept="image/*"  multiple />
                <span id="fileDragArea" class="upload_drag_area">点击上传或者将图片拖到此处</span>
              </label>
              <div id="preview" class="upload_preview"></div>
            </div>
            <div class="upload_submit text-center">
              <button type="button" id="fileSubmit" class="upload_submit_btn btn btn-warning btn-lg">确认上传图片</button>
            </div>
            <div id="uploadInf" class="upload_inf text-center"></div>
          </div>
        </form>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default w90" data-dismiss="modal">返回</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


<script src="../../lib/angular.min.js"></script>
<script src="../../lib/jquery.min.js"></script>
<script src="../../js/sea.js"></script>
<script src="../../js/main.js"></script>
<script>
  seajs.use(['swiper','swiper-css'],function () {
    seajs.use('image',function (cc) {
      new cc.Params('../../data/com.php');
    });
  });
  seajs.use('product',function (pro) {
    pro.productAdd();
  });
</script>
</body>
</html>